<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        // 0 2 6 4 3 (Tick 本轮事件循环结束) 1 （下一次事件循环开始）
        console.log(0);  

        // 下一个宏任务的开始 
        setTimeout(function () {
            console.log(1);    
        });

        new Promise(function(resolve,reject){
            // 同步执行的！
            console.log(2)
            resolve(3) 
            console.log(6)
        }).then(function(val){
            console.log(val);  
        })

        console.log(4)

        // 我们的任务还分为 宏任务 macroTask 和 微任务 microTask

// 宏任务
// 1. script代码块
// 2. setTimeout / setInterval
// 3. setImmediate 

// 微任务
// 1. promise.then() / promise.catch()
// 2. async / await 
// 3. MutationObeserver ==> 监听dom的改变的(Vue源码中有)
// 4. process.nextTick （node）

// 在当前事件循环中，微任务的优先级高，比下一个宏任务的优先级高
// 微任务是属于（包含于）宏任务里面的嘛？ 是
// 1. 一个宏任务中，可以包含多个微任务
// 2. 每执行完一个宏任务，就会清空当前的微任务队列中的所有微任务。

// 执行宏任务，清空当前宏任务中产生的所有微任务，然后再执行下一个宏任务，再清空所有的微任务。


/* ==================== 事件循环 宏微任务 ===================== */
// 1. 首先，我们的script代码块，可以看做是一个宏任务，开始第一个Tick事件循环。
// 2. 先执行当前任务中的所有同步代码，
// 3. 如果遇到宏任务，就放到宏任务队列中等待执行，如果遇到微任务，就放到微任务队列中。
// 4. 当主线程执行完所有的同步代码，首先，去微任务队列中清空当前事件循环的所有微任务（表示这一轮Tick事件循环结束）
// 5. 再去执行下一个宏任务  （下一个宏任务的开始）
    </script>
</body>
</html>